<template>
  <div>
    <div class="an">
      <h1 class="an1">积云会员管理系统</h1>
      <p>
        账号:
        <input
          type="text"
          v-model="user.username"
          :rules="[{ required: true, message: '请填写用户名' }]"
          class="k"
        />
      </p>
      <p>
        密码:
        <input
          type="password"
          v-model="user.password"
          :rules="[{ required: true, message: '请填写密码' }]"
          class="k"
        />
      </p>
      <button class="dl" @click="submit">登录</button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      user: {
        username: "",
        password: "",
      },
    };
  },
//   mounted() {},
  methods: {
    async submit() {
      let res = await this.$axios.post("user/login",{...this.user});
      console.log(res);
    //   if (res.data.message === "登录成功") {
    //     alert("登录成功！");
    //   } else {
    //     alert("登录失败！");
    //   }
    },
  },
};
</script>

<style scoped >
.an {
  text-align: center;
  margin-top: 200px;
}
.an1 {
  font-size: 40px;
  margin-right: -50px;
}
.k {
  width: 300px;
  height: 30px;
}
.dl {
  width: 100px;
  height: 40px;
  font-size: 20px;
  margin-left: -150px;
  color: white;
  background: powderblue;
  border: none;
}
</style>
